

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html" />
        <meta name="author" content="viet-coder.com" charset="utf-8"/>
        <meta charset="utf-8"/>
        <meta name="viewport" content="width=device-width, initial-scale=1.0"/>

        <title>Đăng ký tài khoản</title>
        <style>
            @import url("bootstrap.min.css");
            body{
                background: url('<?php echo base_url(); ?>public/img/bg.jpg');
            }
            #title{

                width: 445px;
                margin: auto;
                text-align: center;
            }
            .input-group{
                text-align: center;
            }
            #input-bt-addon{
                margin-left: 110px;
            }           
        </style>
    </head>
    <body>
        <div class="container" style="width: auto;margin-top: 65px;">
            <div class="content">
                <div class="well" id="title">
                    <span class="input-group-addon" style="font-size: 20px; text-align: center;">Đăng Ký Thành Viên </span> <br />
                    <span class="input-group-addon">(Những trường có dấu (*) là những trường bắt buộc</span>
                </div>
                <form class="well" style="width: 445px;margin: auto;">
                    <div class="input-group">
                        <input class="form-control" name="user" maxlength="20" id="form-lg-control" type="text" placeholder="Tên User"/>
                        <span class="input-group-addon" style="margin-left: 10px;color: red;">(*)</span>
                    </div>
                    <div class="input-group">

                        <input class="form-control" name="email" id="form-email-control" type="text" placeholder="Email"/>
                        <span class="input-group-addon" style="margin-left: 10px;color: red;">(*)</span>
                    </div>
                    <div class="input-group">

                        <input class="form-control" id="form-mk-control" name="pass" maxlength="20" type="password" placeholder="Mật Khẩu"/>
                        <span class="input-group-addon" style="margin-left: 10px; color: red;">(*)</span>
                    </div>
                    <div class="input-group">
                        <input class="form-control" id="form-pre-mk-control" name="pre_pass" maxlength="20" placeholder="Nhập Lại Mật Khẩu" type="password"/>
                        <span class="input-group-addon" style="margin-left: 10px; color: red;">(*)</span>
                    </div>

                    <div class="input-group">
                        <button type="button" class="btn btn-primary btn-lg btn-block" id="btn-lg" name="btn-lg"  style="width: 105px; background: #20B2AA;margin: auto;margin-top: 15px;">
                            Đăng Kí
                        </button>
                    </div>
                </form>
                <div class="well" id="error" style="margin-top: 4px; display: none; color: red;width: 445px;margin: auto;text-align: center;"></div>
            </div>      
        </div>


    </body>
</html>
<!-- teamplate -->
<script type="text/javascript">
   
    $(document).ready(function(){
        $("#form-lg-control").focus();
        $("#form-lg-control").keypress(function(event){
            keyPressAction(event);
        });
        $("#form-mk-control").keypress(function(event){
            keyPressAction(event);
        });
        $("#form-pre-mk-control").keypress(function(event)
        {
            keyPressAction(event);
        });
        $("#form-email-control").keypress(function(event)
        {
            keyPressAction(event);
        });
        
        function keyPressAction(event){
            var keycode = (event.keyCode ? event.keyCode : event.which);
            if(keycode == '13'){
                $("#btn-lg").click();
            }
        }
        
        var user = $("#form-lg-control").val();
        $("#form-lg-control").blur(function(){
            user = $("#form-lg-control").val();
            var error = $("#error") ;
            error.html();
            if(user.length <'4')
            {
                error.html("Tên người dùng phải lớn hơn 4 kí tự");
                $("#form-lg-control").focus(); 
            }
            else{
                jQuery.ajax({
                    type :"POST",
                    url  :"<?php echo base_url(); ?>index.php/user/check_username" ,
                    data :{"user":user},
                                     
                    cache: false, 
                    success:function(data){
                        if(data.trim()=='1')
                        {
                            $("#form-lg-control").val('');
                            $('#form-lg-control').focus();
                            error.html("Tên người dùng đã tồn tại vui lòng thử tên khác!");
                            error.show();
                        }else{
                            error.html("");
                            error.hide();
                        }
                                        
                    }
                });
                    
            }
              
        });
        /**
            check email
         */
    
        $("#form-email-control").blur(function(){
            var error = $("#error");
            var  email_address = $("#form-email-control").val();
            var email_regex = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/i;
            if(!email_regex.test(email_address)){ 
                $("#form-mk-control").val('');
                error.html("Địa chỉ email của bạn không hợp lệ");
                $('#form-email-control').focus();
                error.show();
            }else{
                var email = $("#form-email-control").val();
                jQuery.ajax({
                    type :"POST",
                    url  :"<?php echo base_url(); ?>index.php/user/check_mail" ,
                    data :{"email":email},
                                     
                    cache: false, 
                    success:function(data){
                        if(data.trim()=='3')
                        {
                            $("#form-email-control").val('');
                            error.html("Email này đã tồn tại vui lòng thử email khác!");
                            $('#form-email-control').focus();
                            error.show();
                        }else{
//                            error.html("");
//                            error.hide();
                        }
                                        
                    }
                });
            }
            
        });
        
       
        
        /*
         **Check input username prevent special charactor
         */
        $('#form-lg-control').keypress(function(e){
            if (e.keyCode  == 9)
                return true;
            var k;
            document.all ? k = e.keyCode : k = e.which;
            return ((k > 64 && k < 91) || (k > 96 && k < 123) || k == 8 || k == 32 || (k >= 48 && k <= 57));    
        });
            
            
    
      
      
        $("#btn-lg").click(function(){
            var user = $("#form-lg-control").val();
            var pass = $("#form-mk-control").val();
            var pre_pass = $("#form-pre-mk-control").val();
            var email = $("#form-email-control").val();
            var error = $("#error") ;
            error.html();
            if(pass.length < '4')
            {
                $("#form-mk-control").val('');
                error.html("Mật khẩu phải lớn hơn 4 kí tự");
                $("#form-mk-control").focus();
                return;
              
            }
            
            if(pre_pass.length < '4')
            {
                $("#form-pre-mk-control").val('');
                error.html("Nhập lại mật khẩu phải lớn hơn 4 kí tự");
                $("#form-pre-mk-control").focus();
                return;
            }
                      
            $.ajax({
                type : "POST",
                url  :"<?php echo base_url(); ?>index.php/user/create_account" , 
                data :{"user":user ,"pass":pass,"pre_pass":pre_pass,"email":email},
                cache: false,
                success : function(data){
                    if(data.trim()=='1')
                    {
                        $("#form-lg-control").val('');
                            
                        error.html("Tên người dùng đã tồn tại bạn hãy thử tên khác!");
                        $("#form-lg-control").focus();
                                                
                    }
                    else if(data.trim()=='2')
                    {
                        $("#form-pre-mk-control").val('');
                            
                        error.html("Mật khẩu xác nhận không chính xác");
                        $('#form-pre-mk-control').focus();
                    } 
                        
                    else if(data.trim()=='4')
                    {
                        $("#form-mk-control").val('');
                        error.html("Lỗi hệ thống,đăng ký thất bại");
                        $('#form-mk-control').focus();
                    }
                        
                    else if(data.trim()=='5')
                    {
                        $("#form-email-control").val('');
                        error.html("Email này đã tồn tại vui lòng thử email khác!");
                        $('#form-email-control').focus();
                        error.show();
                    }
                    else{
                        if(data.trim()=='ok')
                        {
                            window.location.href = "<?php echo base_url(); ?>index.php/user/profile";
                        }
                                                
                    }
                }
            });
            $("#error").show();
            
        });
                       
    }) ;
     
</script>




